import { useEffect, useState } from "react";
import UpdateElectron from "@/components/update";
import logoVite from "./assets/logo-vite.svg";
import logoElectron from "./assets/logo-electron.svg";

import "./App.css";

function App() {
    const [selectPath, setSelectPath] = useState("=");
    const [serverMsg, setServerMsg] = useState("");

    useEffect(() => {
        initFn();
    }, []);

    // 双向通信
    const handleClickPath = async () => {
        const slectPath = await window.electronAPI.openFile();
        setSelectPath(slectPath);
    };

    // 前端 -> 服务端
    const sendMsgToServer = () => {
        window.electronAPI.sendMsg(Math.random());
    };

    // 服务段 -> 前端
    const initFn = () => {
        window.electronAPI.getServerPushMsg((msg: any) => {
            setServerMsg(msg);
        });
    };

    return (
        <div className="App">
            <h1>{selectPath}</h1>
            <button onClick={handleClickPath}>选择路径</button>
            <p>发送信息给服务端</p>
            <button onClick={sendMsgToServer}>发送信息给服务端</button>
            <p>服务端推送信息:{serverMsg}</p>
        </div>
    );
}

export default App;
